

function Index (props: any) {
    const handleChange = async (event: any)=> {
        const promiseList = Array.from(event.target.files).map(async file => {
            return {
                file,
                base64url: await read2url(file as File)
            }
        })
        const list = await Promise.all(promiseList)
        console.log(list)
        props.selectFiles?.(list)
    }

    function read2url (file: Blob) {
        return new Promise((resolve, reject) => {
            const reader = new FileReader()
            reader.onload = function (e: any) {
                resolve(reader.result)
            }
            reader.onerror = function (error: any) {
                reject(error)
            }
            reader.readAsDataURL(file)
        })
    }

   
    return <div className="inline-flex relative">
        {/* accept="image/*" */}
        <input accept={props.accept || '*'} className="absolute left-0 top-0 bottom-0 right-0 opacity-0" type="file" onChange={handleChange} />
        {props.children}
    </div>
}
export default Index